<template>
  <el-date-picker
    ref="formItem"
    v-model="valueTmp"
    v-bind="{ ...defaultAttrs, ...$attrs, ...item.attrs }"
    v-on="$listeners"
    @change="handleChange"
  />
</template>

<script>
import formItemMixin from './form-item-mixin'
export default {
  name: 'DatePicker',
  mixins: [formItemMixin],
  data() {
    return {
      // defaultAttrs: {
      //   clearable: true
      // }
    }
  },
  computed: {
    defaultAttrs() {
      const attr = {
        clearable: true
      }
      const dataType = this.item.attrs?.type
      if (dataType === 'daterange' || dataType === 'datetimerange' || dataType === 'monthrange') {
        return {
          ...attr,
          'start-placeholder': '开始时间',
          'end-placeholder': '结束时间',
          'range-separator': '至',
          'default-time': ['00:00:00', '23:59:59'],
          'value-format': 'yyyy-MM-dd HH:mm:ss'
        }
      } else {
        return {
          ...attr,
          placeholder: '请选择',
          'value-format': 'yyyy-MM-dd'
        }
      }
    }
  }
}
</script>

<style scoped></style>
